<template>
  <div v-if="data1" class="detail-main">
    <header-nav/>dssssss
    <!-- details:大图 -->
    <div v-for="{title,subtitle,price,lid,category,details} in data1.result" :key="lid" class="content_warp">
      <!-- 房源标题 -->
      <p class="content_title">{{title}}</p>
      <!-- 房源副标题 -->
      <div class="content_subtitle">
        <span>{{subtitle}}</span>
        <span class="tel_complaint" style="margin-right: 6px">
          {{category}}
        </span>
        <br />
        <i class="gov_title">
          <img
            class="gov_icon"
            src="../assets/img/detail/meng_yan.png"
            alt=""
          />官方正品    品质保障
        </i>
      </div>
      <!-- 房源图片轮播图 -->
      <div class="product_details">
        <!--产品预览-->
        <div id="shop_detail">
          <!-- 左侧-->
          <div id="preview" class="lf">
            <div id="mediumDiv">
              <img :src="details" />
            </div>
            <div id="icon">
              <ul id="icon_list">
                <li>
                  <!-- vr -->
                  <a id="vr" href="">
                    <img src="../assets/img/detail/meng_vr-animation-big.png"/>
                  </a>
                  <img  />
                </li>
              </ul>
            </div>
          </div>
          <!-- 右侧-->
          <div class="content_aside fr" id="aside">
            <!-- 租金及支付方式 -->
            <div class="content_aside-title">
              <span>{{price}}</span>元  惊爆价
              <!-- 右侧微信图标 -->
              <div class="share">
                <span class="icon wechat"></span>分享
                <span class="icon heart"></span>关注
              </div>
            </div>
            <!-- 房源标签列表 -->
            <p class="content_aside-tags">
              <img
                src="../assets/img/detail/meng_good-tag-detail.png"
                alt="必看好房"
              />
              <i class="content_item_tag-is_new">新上</i>
              <i class="content_item_tag-decoration">精品</i>
              <i class="content_item_tag-central_heating">七天无理由</i>
              <i class="content_item_tag-two_bathroom">退换包邮</i>
              <i class="content_item_tag-is_key">24小时发货</i>
            </p>
            <!-- 房源户型、朝向、面积、租赁方式 -->
            <ul class="content_aside_list">
              <li><span class="label">租赁方式：</span>整租</li>
              <li>
                <span class="label">房屋类型：</span>3室2厅2卫 113.00㎡ 精装修
              </li>
              <li class="floor">
                <span class="label">朝向楼层：</span>
                <span class="">南 高楼层/33层</span>
              </li>
              <li>
                <span class="label">更多信息：</span>
                <a href="https://m.lianjia.com/text/disclaimer">用户风险提示</a>
              </li>
            </ul>
            <!-- 经纪人信息 -->
            <div id="ke-agent-sj-sdk">
              <div class="content_aside_list1">
                <span class="touxiang"></span>
                <div class="content_aside_list-title">
                  <span class="contact_name">闫金榜</span>
                  <div class="content_aside_list-subtitle">德佑 经纪人</div>
                </div>
              </div>
              <div class="phone_hover-wrapper">
                <div @click="open">
                  <i></i>
                  立即购买
                </div>
                <span class="contact_im im_online" id="phone1">
                  <i></i>
                  加入购物车
                </span>
                <!-- <span class="contact_im im_online"> 在线咨询 </span> -->
              </div>
            </div>
            <!-- 二维码 -->
            <div id="xcx-phone-wrap" style="opacity: 1">
              <div class="xcx-phone">
                <img
                  class="xcx-qr"
                  src="../assets/img/detail/meng_erweiam.jpg"
                />
                <p>电话咨询无需登录</p>
                <p>微信扫码免费拨打</p>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- 三级导航带吸顶效果 -->
      <div class="content__detail">
        <div id="navFixed" :class="navisFixed == true ? 'isFixed' : ''">
          <el-menu  :default-active="activeIndex" mode="horizontal">
            <el-menu-item index="1">
              <a href="#info" target="_self">房屋信息</a>
            </el-menu-item>
            <el-menu-item index="2">
              <a href="#desc" target="_self">房源描述</a>
            </el-menu-item>
            <el-menu-item index="3">
              <a href="#cost" target="_self">费用详情</a>
            </el-menu-item>
            <el-menu-item index="4">
              <a href="#around" target="_self">位置周边</a>
            </el-menu-item>
            <el-menu-item index="5">
              <a href="#fangyuan" target="_self">附近房源</a>
            </el-menu-item>
          </el-menu>
          <div class="phone_hover-wrapper">
            <div class="content_aside_list-bottom" @click="open">
              <i></i>
              电话咨询
            </div>
            <span class="contact_im im_online" @click="open1">
              <i></i>
              预约看房
            </span>
          </div>
        </div>
        <div id="box">
          <!-- 房源左侧内容 -->
          <div id="content_fr">
            <div class="report_house">
              <img src="../assets/img/detail/meng_zhen.png" />
              <a href="/zufang/truehouse/content" target="_blank">
                真实存在，真实在租，真实价格，假一赔百
                <i class="icon"></i>
              </a>
              <span class="content-right">我要举报</span>
            </div>
            <div class="guarantee__house">
              <img
                class="guarantee-icon"
                src="../assets/img/detail/meng_guarantee-icon.png"
              />
              <span class="guarantee-title">
                免费领取安心租房宝典，手把手教你租好房
              </span>
              <span>
                <el-popover placement="bottom" trigger="hover">
                  <div class="guarantee-content-qrcode">
                    <img
                      class="center-qrcode"
                      src="../assets/img/detail/meng_detail_lianjia.png"
                    />
                  </div>
                  <span slot="reference" class="guarantee-right"
                    >微信扫码查看</span
                  >
                </el-popover>
              </span>
            </div>
            <!-- 房源基本信息 -->
            <div class="content__article__info" id="info">
              <h3 id="info">房屋信息</h3>
              <div class="content_list">
                <div class="fl-list">基本信息</div>
                <ul>
                  <li class="fl oneline">
                    <span>面积：113.00㎡</span>
                    <span>朝向：南</span>
                  </li>
                  <li class="fl oneline">
                    <span>维护：3天前</span>
                    <span>入住：2022-11-08</span>
                  </li>
                  <li class="fl oneline">
                    <span>楼层：高楼层/33层</span>
                    <span>电梯：有</span>
                  </li>
                  <li class="fl oneline">
                    <span>车位：暂无数据</span>
                    <span>用水：民水</span>
                  </li>
                  <li class="fl oneline">
                    <span>用电：民电</span>
                    <span>燃气：有</span>
                  </li>
                  <li class="fl oneline">采暖：集中供暖</li>
                  <li class="fl oneline">
                    <span>租期：暂无数据</span>
                    <span class="lvse">咨询租期</span>
                  </li>
                  <li class="fl oneline"></li>
                  <li class="fl oneline">
                    <span>看房：需提前预约</span>
                    <span class="lvse">咨询看房</span>
                  </li>
                </ul>
              </div>
              <!-- 配套设施列表 -->
              <div class="content_list2">
                <div class="fl-list">配套设施</div>
                <ul>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_xyj.png" alt="" />
                    <p>洗衣机</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_kongdiao.png" alt="" />
                    <p>空调</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_yigui.png" alt="" />
                    <p>衣柜</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_dianshi.png" alt="" />
                    <p>电视</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_bingxinag.png" alt="" />
                    <p>冰箱</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_rsq.png" alt="" />
                    <p>热水器</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_chuang.png" alt="" />
                    <p>床</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_nuanqi.png" alt="" />
                    <p>暖气</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_wifi.png" alt="" />
                    <p>宽带</p>
                  </li>
                  <li class="fl-sheshi">
                    <img src="../assets/img/detail/meng_trq.png" alt="" />
                    <p>天然气</p>
                  </li>
                </ul>
              </div>
            </div>

            <!-- 房源描述 -->
            <div class="content__article__info3" id="desc">
              <h3>房源描述</h3>
              <!-- 房源经纪人 -->
              <div class="ke-agent-sj-sdk">
                <div class="desc-agent">
                  <!-- 头像 -->
                  <i class="info3__icon"></i>
                  <div class="userinfo-detail">
                    <span class="jjr_name">王涛</span>
                    <span class="jjr_icon"></span>
                    <span>
                      <el-popover placement="buttom" trigger="click">
                        <div class="weixin_click">
                          <img
                            src="../assets/img/detail/meng_zhizhao.jpg"
                            height="530px"
                          />
                        </div>
                        <span class="jjr_id" slot="reference"></span>
                      </el-popover>
                    </span>
                    <div class="duty-pic">
                      <span class="duty-icon"></span>
                      <img data-el="dutyPic" src="" />
                    </div>
                    <p>百年行 经纪人</p>
                  </div>
                  <div class="btn-phone"><i></i>电话咨询</div>
                </div>
              </div>
              <!-- 房源图片 -->
              <ul class="piclist">
                <li v-for="img in imgUrl" :key="img.id" id="icon_list">
                  <img :src="img.url" />
                </li>
              </ul>
            </div>

            <!-- 费用详情 -->
            <div class="content__article__info4" id="cost">
              <div class="title__info4">
                <h3>费用详情</h3>
                <span> 去咨询,了解更多&gt; </span>
              </div>
              <p class="title_info">
                年租价 当租期不足1年时租金可能会上浮，详询管家
              </p>
              <div id="cost_content">
                <ul class="table_title">
                  <li class="table_col">
                    付款方式
                    <i></i>
                    <p>半年付</p>
                  </li>
                  <li class="table_col">
                    租金
                    <i>(元/月)</i>
                    <p style="color: red">2400</p>
                  </li>
                  <li class="table_col">
                    押金
                    <i>(元)</i>
                    <img
                      class="wenhao"
                      src="../assets/img/detail/meng_wenhao.png"
                      alt=""
                    />
                    <p>2400</p>
                  </li>
                  <li class="table_col">
                    服务费
                    <i>(元)</i>
                    <p>0</p>
                  </li>
                  <li class="table_col">
                    中介费
                    <i>(元)</i>
                    <p>需咨询</p>
                  </li>
                </ul>
              </div>
            </div>
          </div>
          <!-- 右侧 -->
          <div class="list-recommend">
            <p class="good">必看好房</p>
            <div class="recommend-item">
              <a href="/zufang/XA1683396910242594816.html">
                <img src="../assets/img/detail/meng_fr1.jpg" alt="" />
                <p class="title">整租·普华熙岸 2室2厅</p>
                <p class="desc">纺织城 / 南 / 89.00㎡</p>
                <p class="price">2000元/月</p>
                <p class="tips">该小区低价抢手房</p>
              </a>
            </div>
            <div class="recommend-item">
              <a href="/zufang/XA1695289218248474624.html">
                <img src="../assets/img/detail/meng_fr2.jpg" alt="" />
                <p class="title">整租·合作小区 2室1厅</p>
                <p class="desc">纺织城 / 东南 / 50.00㎡</p>
                <p class="price">1200元/月</p>
                <p class="tips">该小区低价抢手房</p>
              </a>
            </div>
            <div class="recommend-item">
              <a href="/zufang/XA1688772967284080640.html">
                <img src="../assets/img/detail/meng_fr3.jpg" alt="" />
                <p class="title">整租·安置楼小区 1室1厅</p>
                <p class="desc">纺织城 / 南 / 56.00㎡</p>
                <p class="price">1300元/月</p>
                <p class="tips">该小区低价抢手房</p>
              </a>
            </div>
            <div class="recommend-item">
              <a href="/zufang/XA1694977294742847488.html">
                <img src="../assets/img/detail/meng_fr4.jpg" alt="" />
                <p class="title">整租·西安市自来水二厂家属院 3室2厅</p>
                <p class="desc">纺织城 / 南 / 113.00㎡</p>
                <p class="desc">距1号线-纺织城站511m</p>
                <p class="price">2500元/月</p>
              </a>
            </div>
            <div class="recommend-item">
              <a href="/zufang/XA1656284650198269952.html">
                <img src="../assets/img/detail/meng_fr5.jpg" alt="" />
                <p class="title">整租·普华熙岸 2室2厅</p>
                <p class="desc">纺织城 / 南 / 89.00㎡</p>
                <p class="price">2500元/月</p>
              </a>
            </div>
          </div>
        </div>
      </div>

      <!-- 地图和交通 -->
      <div class="content__article__info5 w1150" id="around">
        <h3>地址和交通</h3>
        <el-menu
          :default-active="activeIndex"
          class="el-menu-demo"
          mode="horizontal"
          text-color="#101d37"
          active-text-color="#00ae66"
        >
          <el-menu-item index="1" @click="initMap()">地铁</el-menu-item>
          <el-menu-item index="2">公交</el-menu-item>
          <el-menu-item index="3">学校</el-menu-item>
          <el-menu-item index="4">医院</el-menu-item>
          <el-menu-item index="5">银行</el-menu-item>
          <el-menu-item index="6">餐饮</el-menu-item>
          <el-menu-item index="7">购物</el-menu-item>
        </el-menu>
        <!-- 地图 -->
        <div id="index_container"></div>
      </div>

      <!-- 附近房源 -->
      <div class="content-recommend" id="fangyuan">
        <div class="bottom_list">
          <p class="bottom-title">附近房源</p>
          <div class="bottom_list--wrapper">
            <div class="bottom_list--item">
              <a class="bottom_list--item_link" href="" target="_blank">
                <img src="../assets/img/detail/meng_fj1.jpg" />
              </a>
              <p class="bottom_list--item_des">
                <span>
                  <a href="/zufang/XA2821620293725339648.html" target="_blank"
                    >整租·普华浅水湾 3室2厅</a
                  >
                </span>
                <span class="t-red">2000元/月</span>
              </p>
              <p class="bottom_list--item_btm">
                <span> 纺织城 / 南 北 / 144.00㎡ </span>
              </p>
            </div>
            <div class="bottom_list--item">
              <a class="bottom_list--item_link" href="" target="_blank">
                <img src="../assets/img/detail/meng_fj2.jpg" />
              </a>
              <p class="bottom_list--item_des">
                <span>
                  <a href="/zufang/XA2821620293725339648.html" target="_blank"
                    >整租·普华浅水湾 2室2厅</a
                  >
                </span>
                <span class="t-red">2300元/月</span>
              </p>
              <p class="bottom_list--item_btm">
                <span> 纺织城 / 北 / 94.00㎡ </span>
              </p>
            </div>
            <div class="bottom_list--item">
              <a class="bottom_list--item_link" href="" target="_blank">
                <img src="../assets/img/detail/meng_fj3.jpg" />
              </a>
              <p class="bottom_list--item_des">
                <span>
                  <a href="/zufang/XA2821620293725339648.html" target="_blank"
                    >整租·普华浅水湾 2室1厅</a
                  >
                </span>
                <span class="t-red">2200元/月</span>
              </p>
              <p class="bottom_list--item_btm">
                <span> 纺织城 / 南 北 / 95.00㎡ </span>
              </p>
            </div>
            <div class="bottom_list--item">
              <a class="bottom_list--item_link" href="" target="_blank">
                <img src="../assets/img/detail/meng_fj4.jpg" />
              </a>
              <p class="bottom_list--item_des">
                <span>
                  <a href="/zufang/XA2821620293725339648.html" target="_blank"
                    >整租·普华浅水湾 4室2厅</a
                  >
                </span>
                <span class="t-red">2600元/月</span>
              </p>
              <p class="bottom_list--item_btm">
                <span> 纺织城 / 北 / 144.00㎡ </span>
              </p>
            </div>
            <div class="bottom_list--item">
              <a class="bottom_list--item_link" href="" target="_blank">
                <img src="../assets/img/detail/meng_fjpaishezhong.jpg" />
              </a>
              <p class="bottom_list--item_des">
                <span>
                  <a href="/zufang/XA2821620293725339648.html" target="_blank"
                    >整租·普华浅水湾 2室2厅</a
                  >
                </span>
                <span class="t-red">2200元/月</span>
              </p>
              <p class="bottom_list--item_btm">
                <span> 纺织城 / 南 / 93.00㎡ </span>
              </p>
            </div>
            <div class="bottom_list--item">
              <a class="bottom_list--item_link" href="" target="_blank">
                <img src="../assets/img/detail/meng_fj5.jpg" />
              </a>
              <p class="bottom_list--item_des">
                <span>
                  <a href="/zufang/XA2821620293725339648.html" target="_blank"
                    >整租·普华浅水湾 2室2厅</a
                  >
                </span>
                <span class="t-red">2300元/月</span>
              </p>
              <p class="bottom_list--item_btm">
                <span> 纺织城 / 南 / 95.00㎡ </span>
              </p>
            </div>
            <div class="bottom_list--item">
              <a class="bottom_list--item_link" href="" target="_blank">
                <img src="../assets/img/detail/meng_fjpaishezhong.jpg" />
              </a>
              <p class="bottom_list--item_des">
                <span>
                  <a href="/zufang/XA2821620293725339648.html" target="_blank"
                    >整租·普华浅水湾 2室2厅</a
                  >
                </span>
                <span class="t-red">2600元/月</span>
              </p>
              <p class="bottom_list--item_btm">
                <span> 纺织城 / 南 北 / 94.00㎡ </span>
              </p>
            </div>
            <div class="bottom_list--item">
              <a class="bottom_list--item_link" href="" target="_blank">
                <img src="../assets/img/detail/meng_fj6.jpg" />
              </a>
              <p class="bottom_list--item_des">
                <span>
                  <a href="/zufang/XA2821620293725339648.html" target="_blank"
                    >整租·普华熙岸 2室1厅</a
                  >
                </span>
                <span class="t-red">2200元/月</span>
              </p>
              <p class="bottom_list--item_btm">
                <span> 纺织城 / 南 / 93.00㎡ </span>
              </p>
            </div>
          </div>
        </div>
      </div>

      <!-- 更多房子推荐 -->
      <div class="recommand__more--btn">更多推荐房源</div>
    </div>
    <!-- 页脚 -->
    <div class="footer">
      <div class="wrapper">
        <div class="f-title">
          <ul>
            <li>
              <a href="https://xa.lianjia.com/zufang/wzdt/"
                >网站地图</a
              >
            </li>
          </ul>
          <div class="fr">官方客服 1010 9666</div>
        </div>
        <div class="lianjia-link-box">
          <div id="fl">
            <div class="tab">
              <span
                :class="{ active: now == i }"
                @mouseover="now = i"
                v-for="(item, i) in items"
                :key="i"
                >{{ item }}</span
              >
            </div>
            <!-- 详情列表 -->
            <div v-if="data" class="link-list">
              <!-- 城市二手房 -->
              <div v-show="now == 0">
                <dd v-for="{id, href, name} in data.slice(167, 169)" :key="id">
                  <a :href="href">{{name}}</a>
                </dd>
              </div>
              <!-- 房产咨询 -->
              <div v-show="now == 1">
                <dd v-for="{id, href, name} in data.slice(168, 169)" :key="id">
                  <a :href="href">{{name}}</a>
                  <a :href="href">{{name}}</a>
                </dd>
              </div>
              <!-- 城区租房 -->
              <div v-show="now == 2">
                <dd v-for="{id, href, name} in data.slice(169, 171)" :key="id">
                  <a :href="href">{{name}}</a>
                </dd>
              </div>
            </div>
          </div>
        </div>
        <div class="bottom">
          <div class="copy">
            贝壳找房（北京）科技有限公司 | 网络经营许可证
            <a href="https://beian.miit.gov.cn/#/Integrated/index">京ICP备16057509号-2</a>
            | © Copyright©2010-2022 贝壳找房版权所有 |
            <a href="#">营业执照</a>
            <br />
            违法和不良信息举报电话: 010-86440676
            违法和不良信息举报邮箱:jubaoyouxiang@lianjia.com
            <br />
            涉未成年人举报电话: 010-86440676 涉未成年人举报邮箱:
            jubaoyouxiang@ke.com
          </div>
          <div class="jinghui">
            <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802024019">
              <img src="/" alt="" />
              <p>京公网安备 11010802024019号</p>
            </a>
            <a href="https://www.12377.cn/">网上有害信息举报专区</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import HeaderNav from '@/components/HeaderNav.vue'
// import AMapLoader from "@amap/amap-jsapi-loader"
// window._AMapSecurityConfig = {
//   securityJsCode: "1cf77de78a6257417e9d24a81975dbfd",
// }
export default {
  components: { HeaderNav },
  data() {
    return {
       data1: null,
      activeIndex: "1",
      imgUrl: [
        { index: 1, url: require("../assets/img/detail/meng_da1.jpg") },
        { index: 2, url: require("../assets/img/detail/meng_da2.jpg") },
        { index: 3, url: require("../assets/img/detail/meng_da3.jpg") },
        { index: 4, url: require("../assets/img/detail/meng_da4.jpg") },
        { index: 5, url: require("../assets/img/detail/meng_da5.jpg") },
        { index: 6, url: require("../assets/img/detail/meng_da6.jpg") },
      ],
      // 大图片默认显示第一张
      ImgUrl: require("../assets/img/detail/meng_da1.jpg"),
      now: 0,
      navisFixed: false,
      // 页脚导航条数据
      items: ["城市二手房", "房产咨询", "城区租房"],
      now: 0,
      data: null,
      map: null,
    }
  },
  mounted() {
    this.getHref()
    window.addEventListener("scroll", this.watchScroll)
    this.getData()
    //DOM初始化完成进行地图初始化
    // this.initMap()
  },



  // ////////////////////////////////////////////////////////////
  methods: {
    getHref(){
      let id = window.location.href.split('?')[1]
      console.log(id)
      const url = 'detail?'+id
      this.axios.get(url).then((res)=>{
        console.log('详情是:',res.data)
        this.data1 = res.data
      })
    },
    getIndex(imgUrl) {
      this.ImgUrl = imgUrl
    },
    // 滚动事件绑定
    watchScroll() {
      var scrollTop = document.documentElement.scrollTop
      //  当滚动超过 740px 时，实现吸顶效果
      if (scrollTop > 740) {
        this.navisFixed = true
      } else {
        this.navisFixed = false
      }
    },
    getData(){
      const url = ' http://localhost:3000/footerlist'
      this.axios.get(url).then(res =>{
        console.log(res);
        this.data = res.data
      })
    },
    open() {
      this.$notify({
        title: '您好, 网页无法电联请拨下方电话',
        message: '177 9295 6702',
        type: 'warning',
        duration: 5000,
      });
    },
    open1() {
      this.$message({
        message: '预约成功, 已安排经纪人电联, 请等待',
        type: 'success'
      });
    },
    // initMap() {
    //   AMapLoader.load({
    //     key: "ec12fbaf0a012d72f1919e2cadb61ec3", // 申请好的Web端开发者Key，首次调用 load 时必填
    //     version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
    //     plugins: ["AMap.ToolBar", "AMap.Scale", "AMap.Geolocation",'AMap.MapType',], // 需要使用的的插件列表
    //   })
    //     .then((AMap) => {
    //       this.map = new AMap.Map("index_container", {
    //         //设置地图容器id
    //         viewMode: "3D", //是否为3D地图模式
    //         zoom: 14, //初始化地图级别
    //         center: [109.079836, 34.297493], //初始化地图中心点位置
    //       })
    //       this.map.addControl(new AMap.Scale({ position: "LB" }))
    //       this.map.addControl(new AMap.ToolBar({ position: "LT" }))
    //       this.map.addControl(new AMap.MapType());
    //       this.map.addControl(
    //         new AMap.Geolocation({
    //           position: "LB",
    //           offset: [20, 60],
    //         })
    //       )

    //       //添加固定点标记
    //       let marker1 = new AMap.Marker({
    //         position: new AMap.LngLat(109.079836, 34.297493), // 经纬度对象
    //         title: "普华·浅水湾",
    //       })
    //       //添加点标记
    //       this.map.add(marker1)

    //       //标记显示的文字提示
    //       marker1.setLabel({
    //         offset: new AMap.Pixel(1, -3), //设置文本标注偏移量
    //         content:
    //           '<p style="padding: 8px; font-size: 15px; background:#00ae66;color: #fff; font-weight: bold;">' +
    //           "普华·浅水湾" +
    //           "</p>",
    //         direction: "top",
    //       })

    //       //圆点标记示例
    //       let circleMarker1 = new AMap.CircleMarker({
    //         map: this.map,
    //         center: new AMap.LngLat(109.079836, 34.297493),
    //         radius: 20,
    //         fillColor: "#40e19e",
    //       })
    //       circleMarker1.setMap(this.map)
    //     })
    //     .catch((e) => {
    //       console.log(e)
    //     })      
    // },
  },
  // 添加滚动监听
  
}
</script>

<style lang="scss" scoped>
#container {
  margin-top: 200px;
  height: 480px;
  width: 1150px;
  z-index: 67;
}
</style>

// <style scoped src="../assets/css/reset.css"></style>
<style scoped src="../assets/css/detail_main.css"></style>
